<template>
    <TableList
        :columns="recordCol"
        :data="recordList"
        :page.sync="query.pageIndex"
        :size.sync="query.pageSize"
        :total="recordTotal"
        @queryFun="getAnswerRecord"
    ></TableList>
</template>
<script>
import { videoLearnStatictics } from '@/api/selfStudy/class_new.js';
export default {
    name: 'answerRecord',
    props: ['classNumberId', 'classId', 'status', 'type'],
    components: {},
    data() {
        return {
            query: {
                pageIndex: 1,
                pageSize: 10
            },
            recordList: [],
            recordTotal: 0,
            page: 1,
            pageSize: 10,
            recordCol: [
                //学员 视频名称 是否已看
                {
                    type: 'index',
                    title: '序号'
                },
                {
                    title: '学员昵称',
                    key: 'studentName'
                },
                {
                    title: '课件名',
                    key: 'ecName'
                },
                {
                    title: '视频',
                    key: 'expVideoName'
                },
                {
                    type: 'Tag',
                    title: '是否已看',
                    key: 'finished',
                    width: 100,
                    setColor: (finished) => {
                        return finished ? 'var(--status-yes)' : 'var(--status-no)';
                    },
                    filter: (finished) => {
                        return finished ? '是' : '否';
                    }
                }
            ],
            timeout: ''
        };
    },
    computed: {},
    watch: {
        classNumberId: function(val) {
            this.getAnswerRecord();
        }
    },
    filters: {},
    created() {},
    mounted() {
        if (this.classNumberId) {
            this.getAnswerRecord();
        }
    },
    beforeDestroy() {
        clearTimeout(this.timeout);
    },
    methods: {
        // getData(page, size) {
        //     this.query.pageIndex = page;
        //     this.query.pageSize = size;
        //     if (this.classNumberId) {
        //         this.getAnswerRecord();
        //     }
        // },
        getAnswerRecord() {
            videoLearnStatictics(this.classId, this.classNumberId, this.query)
                .then((data) => {
                    if (data.code == 1) {
                        this.recordList = data.data.items;
                        this.recordTotal = data.data.total;
                        clearTimeout(this.timeout);
                        if (this.status === 1) {
                            this.timeout = setTimeout(() => {
                                this.getAnswerRecord();
                            }, 5000);
                        }
                    } else {
                        this.$Message.warning(data.message);
                    }
                })
                .catch((error) => {
                    this.$Message.error(error.message);
                });
        },
        changePage(page) {
            this.query.pageIndex = page;
            this.getAnswerRecord();
        }
    }
};
</script>
<style scoped></style>
